<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="utf-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <title>登陆</title> 
    <link href="${pageContext.request.contextPath}/statics/css/base.css" rel="stylesheet">
    <link href="${pageContext.request.contextPath}/statics/css/login/login.css" rel="stylesheet">
</head> 
<body>
	<div class="login-hd">
		<div class="left-bg"></div>
		<div class="right-bg"></div>
		<div class="hd-inner">
			<span class="logo"></span>
			<span class="split"></span>
			<span class="sys-name">蓝领安装汽车服务商平台</span>
		</div>
	</div>
	<div class="login-bd">
		<div class="bd-inner">
			<div class="inner-wrap">
				<div class="lg-zone">
					<div class="lg-box box1" style="display: block;">
						<div class="lg-label"><h4>用户登录</h4></div>
						<div class="alert alert-error">
			              <i class="iconfont">&#xe62e;</i>
			              <span>请输入用户名</span>
			            </div>
						<form class="form0" action="${pageContext.request.contextPath}/login" method="post">
							<div class="lg-username input-item clearfix">
								<i class="iconfont">&#xe60d;</i>
								<input type="text" name="username" placeholder="用户名">
							</div>
							<div class="lg-password input-item clearfix">
								<i class="iconfont">&#xe634;</i>
								<input type="password" name="password" placeholder="密码">
							</div>
							<div class="lg-check clearfix">
								<div class="input-item">
									<i class="iconfont">&#xe633;</i>
									<input type="text" name="code" placeholder="验证码">
								</div>
								<img class="check-code" src="${pageContext.request.contextPath}/captcha/getCaptchaCode" onclick="this.src=this.src+'?v=1'"></img>
							</div>
							<div class="tips clearfix">
								<a href="javascript:;" class="register btn1">切换到手机登录</a>
							</div>
							<div class="enter" style="padding-left:108px">
								<a href="javascript:;" class="supplier submit1">登录</a>
							</div>
						</form>
					</div>
					<div class="lg-box box2" style="display: none;">
						<div class="lg-label"><h4>手机登录</h4></div>
						<form class="form1" action="${pageContext.request.contextPath}/mobilelogin" method="post">
							<div class="lg-username input-item clearfix">
								<i class="iconfont">&#xe60d;</i>
								<input type="text" name="mobile" placeholder="手机号">
							</div>
							<div class="lg-check clearfix">
								<div class="input-item">
									<i class="iconfont">&#xe633;</i>
									<input type="text" name="code" placeholder="验证码">
								</div>
								<a class="check-code sendsms" style="cursor: pointer;">发送验证码</a>
							</div>
							<div class="tips clearfix">
								<a href="javascript:;" class="register btn2">切换到用户登录</a>
							</div>
							<div class="enter" style="padding-left:108px">
								<a href="javascript:;" class="supplier submit2">登录</a>
							</div>
						</form>
					</div>
				</div>
				<div class="lg-poster"></div>
			</div>
		</div>
	</div>
	<div class="login-ft">
		<div class="ft-inner">
			<div class="about-us">
				<a href="javascript:;">关于我们</a>
				<a href="javascript:;">法律声明</a>
				<a href="javascript:;">服务条款</a>
				<a href="javascript:;">联系方式</a>
			</div>
			<div class="address">地址：江苏省南京市雨花台区软件园&nbsp;邮编：210019&nbsp;&nbsp;Copyright&nbsp;©&nbsp;2015&nbsp;-&nbsp;2016&nbsp;uimaker-专注于ui设计&nbsp;版权所有</div>
			<div class="other-info">建议使用IE8及以上版本浏览器&nbsp;苏ICP备&nbsp;09003078号&nbsp;E-mail：admin@uimaker.com</div>
		</div>
	</div>
</body>
<script type="text/javascript" src="${pageContext.request.contextPath}/statics/js/jquery.js"></script>
<script type="text/javascript">
	$(function() {
		$('.submit1').on('click', function() {
			// 数据校验
			$('.form0').submit();
		});
		
		$('.submit2').on('click', function() {
			// 数据校验
			$('.form1').submit();
		});
		
		
		$('.btn1').on('click', function() {
			$('.box1').hide();
			$('.box2').show();
		});
		
		$('.btn2').on('click', function() {
			$('.box2').hide();
			$('.box1').show();
		});
		
		
		$('.sendsms').on('click', function() {
			var $mobile = $('[name="mobile"]');
			if ($.trim($mobile.val()) == '') {
				alert('手机号码不能为空');
				return;
			}
			var url = '${pageContext.request.contextPath}/sms/send';
			$.getJSON(url, {"mobile":$.trim($mobile.val())}, function(data) {
				if (data.msg == 'true') {
					alert('验证码发送成功');
				} else {
					alert('验证码发送失败');
				}
			});
			
		});;
		
	});
	
	<c:if test="${not empty requestScope['login.username']}">
		alert("${requestScope['login.username']}");
	</c:if>
	<c:if test="${not empty requestScope['login.password']}">
		alert("${requestScope['login.password']}");
	</c:if>
	<c:if test="${not empty requestScope['login.code']}">
		alert("${requestScope['login.code']}");
	</c:if>
	<c:if test="${not empty errorMessage}">
		alert('${errorMessage}');
	</c:if>
	</script>
</html>
